import React, {Component} from 'react';
import {
  HomeWrapper,
} from './style';

import { connect } from 'react-redux';

import Recommend from './components/Recommend';
import List from './components/List';
import {actionCreators} from "./store";

class Home extends Component{
  render() {
    // console.log(this.props.homeList);
    const { homeList} = this.props;
    return (
      <div className='main'>
        <HomeWrapper>
          <Recommend/>
          <List homeList = { homeList } />
        </HomeWrapper>
      </div>
    );
  };


  componentDidMount() {
    this.props.getListData();
  };
}

const mapStateToProps = (state) => ({
  homeList: state.home.homeList
});


const mapDispatchToProps= (dispatch) => ({
  getListData() {
    dispatch(actionCreators.getListData());
  }
});

export default connect(mapStateToProps, mapDispatchToProps)(Home);